﻿<UserControl x:Class="Studio77.SuperLink.Views.StageItemView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="480" d:DesignWidth="480" Width="100" Height="100">
	<UserControl.Resources>
		<Storyboard x:Name="StoryboardShowing">
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="bdrContent">
				<EasingDoubleKeyFrame KeyTime="0" Value="0.1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1">
					<EasingDoubleKeyFrame.EasingFunction>
						<QuinticEase EasingMode="EaseInOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="bdrContent">
				<EasingDoubleKeyFrame KeyTime="0" Value="0.1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="1">
					<EasingDoubleKeyFrame.EasingFunction>
						<QuinticEase EasingMode="EaseInOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" Storyboard.TargetName="bdrContent">
				<EasingDoubleKeyFrame KeyTime="0" Value="-90"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="{Binding AimRotated}">
					<EasingDoubleKeyFrame.EasingFunction>
						<QuinticEase EasingMode="EaseInOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
		</Storyboard>
		<Storyboard x:Name="StoryboardClick">
			<DoubleAnimation Duration="0" To="{Binding AimRotated}" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" Storyboard.TargetName="bdrContent" d:IsOptimized="True"/>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="bdrContent">
				<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.05">
					<EasingDoubleKeyFrame.EasingFunction>
						<BackEase EasingMode="EaseIn"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
				<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1">
					<EasingDoubleKeyFrame.EasingFunction>
						<CircleEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
			<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="bdrContent">
				<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
				<EasingDoubleKeyFrame KeyTime="0:0:0.1" Value="1.05">
					<EasingDoubleKeyFrame.EasingFunction>
						<BackEase EasingMode="EaseIn"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
				<EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1">
					<EasingDoubleKeyFrame.EasingFunction>
						<CircleEase EasingMode="EaseOut"/>
					</EasingDoubleKeyFrame.EasingFunction>
				</EasingDoubleKeyFrame>
			</DoubleAnimationUsingKeyFrames>
			<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.Background).(SolidColorBrush.Color)" Storyboard.TargetName="bdrContent">
				<EasingColorKeyFrame KeyTime="0" Value="#FFFFE749"/>
				<EasingColorKeyFrame KeyTime="0:0:0.1" Value="#FFFF9800"/>
				<EasingColorKeyFrame KeyTime="0:0:0.2" Value="White"/>
			</ColorAnimationUsingKeyFrames>
		</Storyboard>
	</UserControl.Resources>
    
    <Viewbox x:Name="viewbox">
    
		<Grid x:Name="LayoutRoot" Height="100" Width="100">
			<Border x:Name="bdrContent" BorderThickness="1" CornerRadius="8" Margin="0" Background="White" BorderBrush="#FFA3A3A3" Width="90" Height="90" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.093,0.093">
				<Border.RenderTransform>
					<CompositeTransform Rotation="-90" ScaleX="0.1" ScaleY="0.1"/>
				</Border.RenderTransform>
				<Grid Margin="0">
                    <Image x:Name="imgContent" Margin="6" Source="{Binding StageImage}"/>
					<Border BorderThickness="1,1,0,0" Height="14" Margin="0" VerticalAlignment="Bottom" CornerRadius="8,0,8,0" Background="White" HorizontalAlignment="Right" Width="45" BorderBrush="#FFA3A3A3">
                        <Grid>
                            <Image Visibility="{Binding TwoStarVisibility}" Source="/Images/two_star.png" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="2,1"/>
                            <Image Visibility="{Binding OneStarVisibility}" Source="/Images/one_star.png" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="2,1"/>
                            <Image Visibility="{Binding ThreeStarVisibility}" Source="/Images/three_star.png" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="2,1"/>
                            <Image Visibility="{Binding NoStarVisibility}" Source="/Images/no_star.png" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="2,1"/>
                        </Grid>
					</Border>
				</Grid>
			</Border>
			<Grid HorizontalAlignment="Left" VerticalAlignment="Top" Height="27" Width="27">
				<Ellipse Fill="#FFE5E5E5" Margin="0" Stroke="#FF646464"/>
				<TextBlock HorizontalAlignment="Center" TextWrapping="Wrap" Text="{Binding Index,StringFormat=D2}" Foreground="#FF4E4E4E" FontSize="13.333" FontFamily="Segoe WP" Margin="0,4,0,5" d:LayoutOverrides="Height" FontWeight="Bold"/>

			</Grid>

		</Grid>
	</Viewbox>
</UserControl>
